<!DOCTYPE html>
<html>
<head>
	<title>Appending An Array Of jQuery Objects To The DOM</title>
    	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="css/rightsize2.min.css" />
	<link rel="stylesheet" href="css/jquery.mobile.structure-1.0rc2.min.css" /> 

	<script type="text/javascript" charset="utf-8" src="js/phonegap-1.1.0.js"></script>
    <script type="text/javascript" src="js/jquery-1.6.4.js"></script> 
 	<script type="text/javascript" src="js/jquery.mobile-1.0rc2.min.js"></script>

</head>
<body>
 
	<h1>
		Appending An Array Of jQuery Objects To The DOM
	</h1>
 
	<ul class="friends"  data-role="listview">
        <li><a data-rel="dialog" data-transition="pop" href="#">Marke: item.mname <br/>Kategorie: item.cname </a>
        </li> 
	</ul>
 

	<script type="text/javascript">
 
		function createFriendNode( name ){
		 
			// Create the friend node.
			return "<li><a data-rel=\"dialog\" data-transition=\"pop\" href=\"#\">" + name + "<br/>Kategorie: item.cname </a></li>";
		}
		 
		// Create an array of friends.
		var buffer = [];
		buffer.push( createFriendNode( "Joanna" ) );
		buffer.push( createFriendNode( "Lisa" ) );
		buffer.push( createFriendNode( "Tricia" ) );
		buffer.push( createFriendNode( "Kim" ) );
		 
		// Append the friends to the DOM.
		$( "ul.friends" ).append( buffer.join('\n') );
	</script>
 
</body>
</html>